import 'package:fish_redux/fish_redux.dart';
import 'package:flutter/material.dart';
import '../../../../app_files.dart';
import 'action.dart';
import 'state.dart';
import '../../BindAccountView/AccountInfoView/state.dart';

Widget buildView(
    SendProblemViewState state, Dispatch dispatch, ViewService viewService) {
  List<String> _titles = ['联系人', '联系方式', '报修地址', '预约时间'];

  Widget _rightWidget(int index) {
    switch (index) {
      case 0:
        return TextField(
          style: TextStyle(fontSize: 15, color: ThemeConfig.blackColor),
          decoration: InputDecoration(
            border: InputBorder.none,
            hintText: "请输入联系人",
            hintStyle: TextStyle(fontSize: 15),
            contentPadding: EdgeInsets.only(),
          ),
          controller: state.contactController,
        );
      case 1:
        return TextField(
          style: TextStyle(fontSize: 15, color: ThemeConfig.blackColor),
          keyboardType: TextInputType.phone,
          decoration: InputDecoration(
            border: InputBorder.none,
            hintText: "请输入联系方式",
            hintStyle: TextStyle(fontSize: 15),
            contentPadding: EdgeInsets.only(),
          ),
          controller: state.phoneController,
        );
      case 2:
        return TextField(
          style: TextStyle(fontSize: 15, color: ThemeConfig.blackColor),
          decoration: InputDecoration(
            border: InputBorder.none,
            hintText: "请输入报修地址",
            hintStyle: TextStyle(fontSize: 15),
            contentPadding: EdgeInsets.only(),
          ),
          controller: state.addressController,
        );
      case 3:
        return InkWell(
          child: Padding(
            padding: EdgeInsets.only(),
            child: Text(
              state.time ?? '请选择预约时间',
              style: TextStyle(
                color: state.time == null
                    ? Color(0xff999999)
                    : ThemeConfig.blackColor,
                fontSize: 15,
              ),
            ),
          ),
          onTap: () => dispatch(SendProblemViewActionCreator.onTap(1)),
        );
    }
    return Container();
  }

  Widget _items() {
    List<Widget> list = _titles.map<Widget>((String title) {
      int index = _titles.indexOf(title);
      return Container(
        height: 55,
        padding: EdgeInsets.symmetric(horizontal: 15),
        decoration: BoxDecoration(
            border: Border(bottom: BorderSide(color: ThemeConfig.separeColor)),
            color: Colors.white),
        child: Row(
          children: <Widget>[
            Container(
              width: 100,
              child: Text(
                title,
                style: TextThemeConfig.Font14WithColor22,
              ),
            ),
            Expanded(
              child: _rightWidget(index),
            ),
            (index == 3)
                ? Icon(
                    CupertinoIcons.right_chevron,
                    color: Color(0xffC1C1C1),
                  )
                : Container()
          ],
        ),
      );
    }).toList();

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: list,
    );
  }

  Widget _contentWidget() => Container(
        margin: EdgeInsets.only(top: 10),
        color: Colors.white,
        width: double.infinity,
        padding: EdgeInsets.all(15),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Padding(
              padding: EdgeInsets.only(bottom: 15),
              child: Text(
                '问题描述',
                style: TextThemeConfig.Font15WithColor22,
              ),
            ),
            Container(
              color: Colors.white,
              height: 100,
              width: double.infinity,
              child: TextField(
                style: TextStyle(
                  fontSize: 15,
                  color: ThemeConfig.blackColor,
                ),
                maxLines: 10,
                decoration: InputDecoration(
                  border: InputBorder.none,
                  hintText: "请您如实填写反馈的内容",
                  hintStyle: TextStyle(fontSize: 15),
                  contentPadding: EdgeInsets.only(),
                ),
                controller: state.contentController,
              ),
            ),
            viewService.buildComponent('imagePicker'),
          ],
        ),
      );

  return Scaffold(
    appBar: myAppBar(viewService.context, title: '预约报修'),
    resizeToAvoidBottomPadding: false,
    body: state.model == null
        ? MyLoadingWidget()
        : GestureDetector(
            behavior: HitTestBehavior.translucent,
            onTap: () =>
                FocusScope.of(viewService.context).requestFocus(FocusNode()),
            child: SingleChildScrollView(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  _items(),
                  _contentWidget(),

                  Container(
                    margin: EdgeInsets.only(left: 15, right: 15, top: 40),
                    height: 50,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.all(Radius.circular(4)),
                      color: ThemeConfig.mainColor,
                    ),
                    child: InkWell(
                      child: Center(
                        child: Text(
                          '提交',
                          style: TextThemeConfig.Font16WithWhite,
                        ),
                      ),
                      onTap: () =>
                          dispatch(SendProblemViewActionCreator.onSubmit()),
                    ),
                  ),
                ],
              ),
            ),
          ),
  );
}
